<template>
	<view class="myView">
		<view class="children">
			<text class="myText">文本</text>
		</view>
		<view class="children">
			<text class="myText">文本</text>
		</view>
		<view class="children">
			<text class="myText">文本</text>
		</view>
		<view class="children">
			<text class="myText">文本</text>
		</view>
	</view>
</template>

<script setup>
import { onLoad } from '@dcloudio/uni-app';
const getWidthHeight = async () => {
	const systemInfo = await uni.getSystemInfo();
};
onLoad(() => {
	getWidthHeight();
});
</script>

<style lang="scss" scoped>
.myView {
	// background-color: #0f0f0f;
	width: 750rpx;
	height: 200rpx;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	align-items: center;
	.children {
		width: 300rpx;
		background-color: #0ff;
		text-align: center;
		.myText {
			font-size: calc(14px + (0.5vw * (var(--screen-width) / 375)));
		}
	}
}
</style>
